<template>
	<scroll-view class="my-follow" scroll-y>
		<view class="list">
			<seller v-for="(item,index) in list" :key="item.id" :index="index" :item="item" @details="toDetails" @unFollow="unFollow"></seller>
		</view>
		<view v-if="list.length > 0" @click="getList">
			<v-loadmore :status="loadStatus"></v-loadmore>
		</view>
		<v-nodata v-else-if="page > 1"></v-nodata>
	</scroll-view>
</template>

<script>
	import seller from "./seller";
	export default{
		components:{
			seller
		},
		data(){
			return {
				list: [],
				loadStatus: "more",
				page: 1,
				total: 0,
				isReset: false
			}
		},
		mounted() {
			this.getList();
		},
		methods:{
			toDetails(uid){
				console.log(uid);
				this.$tool.navto("/pages/other/user_info?uid="+uid)
			},
			getList(){
				if (this.loadStatus != "more") return;
				this.loadStatus = "loading";
				this.$http.get("v1/getMyFollowPageData?page=" + this.page).then(res=>{
					let data = res.data.pageData;
					if(this.page == 1) this.total = data.total;
					if(this.isReset) {
						this.list = [];
						this.isReset = false;
					}
					
					this.list.push(...data.data);
					
					if(this.list.length >= this.total) this.loadStatus = "nomore";
					else this.loadStatus = "more";
					
					this.page++;
				}).catch(err => {
					this.loadStatus = "more";
				});
			},
			reset(){
				this.loadStatus = "more";
				this.page = 1;
				this.total = 0,
				this.isReset = true;
			},
			reload(){
				this.reset();
				this.getList();
			},
			unFollow(index){
				let item = this.list[index];
				this.$http.get(`v1/unFollowUser/${item.id}`).then(res=>{
					this.reload();
				});
			}
		}
	}
</script>

<style lang="scss" scoped>
	.my-follow{
		height: 100%;
	}
	.list{
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
	}

</style>